<template>
  <div class="register">
    <nav-bar />
    <div class="reg-area">
      <div class="btn-area">
        <el-button type="primary" round @click="openToken"
          >查看远程Token</el-button
        >
        <el-button
          type="success"
          round
          @click="registerToken"
          :disabled="!Boolean(userInfo)"
          >添加本地Token</el-button
        >
      </div>
      <p class="tip">点击全选复制token，粘贴在以下输入框</p>
      <el-input
        class="input-area"
        type="textarea"
        v-model="userInfo"
        placeholder="输入token点击添加本地Token， 形如：{“access_token”:...}"
        :rows="10"
      ></el-input>
    </div>
  </div>
</template>

<script>
import NavBar from "../components/NavBar.vue";
import { git } from "../config/info";
export default {
  components: { NavBar },
  name: "register",
  data() {
    return {
      userInfo: "",
    };
  },
  computed: {},
  methods: {
    openToken() {
      window.open(
        `https://gitee.com/${git.owner}/${git.repo}/blob/${git.branch}/token.txt`
        // `https://gitee.com/${git.owner}/${git.repo}/raw/${git.branch}/token.txt`
      );
    },
    registerToken() {
      if (this.userInfo) {
        localStorage.setItem("userInfo", this.userInfo);
        this.$message.success("设置成功");
      } else {
        this.$message.warning("设置失败");
      }
    },
  },
  created() {
    let userInfo = JSON.parse(localStorage.getItem("userInfo"));
    if (userInfo) {
      this.userInfo = JSON.stringify(userInfo);
    }
  },
};
</script>

<style lang="scss" scoped>
.register {
  height: 90%;
  display: flex;
  flex-direction: column;
  .reg-area {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    .btn-area {
      width: 100%;
      margin: 10px auto;
      display: flex;
      justify-content: center;
    }
    .tip {
      display: flex;
      justify-content: center;
      font-size: 12px;
      color: #999;
    }
    .input-area {
      width: 90%;
    }
  }
}
</style>